import React, {Component} from 'react';
import {NavLink} from "react-router-dom";
import './NavBar.scss'

import nav1 from '../../../assets/navimg/nav-1.png'
import nav2 from '../../../assets/navimg/nav-2.png'
import nav3 from '../../../assets/navimg/nav-3.png'
import nav4 from '../../../assets/navimg/nav-4.png'


class NavBar extends Component {
    render() {
        return (
            <div className='navbar'>
                <div className='page'>
                    <NavLink className='link' to='/homelist' push>
                        <img src={nav1} alt="index"/>
                        <span>整租</span>
                    </NavLink>
                </div>
                <div className='page'>
                    <NavLink className='link' to='/homelist' push>
                        <img src={nav2} alt="find_home"/>
                        <span>合租</span>
                    </NavLink>
                </div>
                <div className='page'>
                    <NavLink className='link' to='/map' push>
                        <img src={nav3} alt="consult"/>
                        <span>地图找房</span>
                    </NavLink>
                </div>
                <div className='page'>
                    <NavLink className='link' to='/rent' push>
                        <img src={nav4} alt="myself"/>
                        <span>去出租</span>
                    </NavLink>
                </div>
            </div>
        );
    }
}

export default NavBar;
